<template>
  <div>
    <el-form ref="genInfoForm" :model="info" :rules="rules" label-width="150px">
      <el-row>
        <el-col :span="12">
          <el-form-item prop="packageName">
            <span slot="label">
              生成包路径
              <el-tooltip content="生成在哪个java包下，例如 com.ruoyi.system" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <el-input v-model="info.packageName" />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item prop="className">
            <span slot="label">
              生成类名
              <el-tooltip content="类名" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <el-input v-model="info.className" />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item prop="businessName">
            <span slot="label">
              生成业务名
              <el-tooltip content="可理解为功能英文名，例如 user" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <el-input v-model="info.businessName" />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item prop="functionName">
            <span slot="label">
              生成方法名
              <el-tooltip content="方法名" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <el-input v-model="info.functionName" />
          </el-form-item>
        </el-col>


        <el-col :span="12">
          <el-form-item prop="genType">
            <span slot="label">
              生成代码方式
              <el-tooltip content="默认为zip压缩包下载，也可以自定义生成路径" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <el-radio v-model="info.genType" label="0">zip压缩包</el-radio>
            <el-radio v-model="info.genType" label="1">自定义路径</el-radio>
          </el-form-item>
        </el-col>

        <el-col :span="24" v-if="info.genType == '1'">
          <el-form-item prop="genPath">
            <span slot="label">
              自定义路径
              <el-tooltip content="填写磁盘绝对路径，若不填写，则生成到当前Web项目下" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <el-input v-model="info.genPath">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item prop="sql">
            <span slot="label">
              sql语句
              <el-tooltip content="sql" placement="top">
                <i class="el-icon-question"></i>
              </el-tooltip>
            </span>
            <el-input type="textarea" v-model="info.sql" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item style="text-align: center;margin-left:-100px;margin-top:10px;">
            <el-button type="primary" @click="yunxinSql()">运行sql</el-button>
            <el-button type="primary" @click="handlePreview()">预览代码</el-button>
            <el-button type="primary" @click="handleGenTable()">生成代码</el-button>
          </el-form-item>
        </el-col>

      </el-row>


    </el-form>
    <!-- 预览界面 -->
    <el-dialog :title="preview.title" :visible.sync="preview.open" width="80%" top="5vh" append-to-body class="scrollbar">
      <el-tabs v-model="preview.activeName">
        <el-tab-pane
          v-for="(value, key) in preview.data"
          :label="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))"
          :name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))"
          :key="key"
        >
          <pre><code class="hljs" v-html="highlightedCode(value, key)"></code></pre>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>
  </div>
</template>
<script>
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {genCodeSql, previewTableSql, yunxinSql} from "@/api/tool/gen";
import hljs from "highlight.js/lib/highlight";
import "highlight.js/styles/github-gist.css";
hljs.registerLanguage("java", require("highlight.js/lib/languages/java"));
hljs.registerLanguage("xml", require("highlight.js/lib/languages/xml"));
hljs.registerLanguage("html", require("highlight.js/lib/languages/xml"));
hljs.registerLanguage("vue", require("highlight.js/lib/languages/xml"));
hljs.registerLanguage("javascript", require("highlight.js/lib/languages/javascript"));
hljs.registerLanguage("sql", require("highlight.js/lib/languages/sql"));
export default {
  name: "BasicInfoForm",
  components: { Treeselect },
  data() {
    return {
      info:{
        packageName:"com.ruoyi.system",
        className:"System",
        businessName:"system",
        functionName:"getshuju",
        genType:"0",
        genPath:"/ruoyi-system"
      },
      tables:[],
      menus:[],
      subColumns: [],
      rules: {
        packageName: [
          { required: true, message: "请输入生成包路径", trigger: "blur" }
        ],
        className: [
          { required: true, message: "请输入生成类名", trigger: "blur" }
        ],
        businessName: [
          { required: true, message: "请输入生成业务名", trigger: "blur" }
        ],
        functionName: [
          { required: true, message: "请输入生成功能名", trigger: "blur" }
        ],
        sql: [
          { required: true, message: "请输入sql语句", trigger: "blur" }
        ],
      },
      // 预览参数
      preview: {
        open: false,
        title: "代码预览",
        data: {},
        activeName: "domain.java"
      }
    };
  },
  created() {},
  methods: {
    /** 高亮显示 */
    highlightedCode(code, key) {
      const vmName = key.substring(key.lastIndexOf("/") + 1, key.indexOf(".vm"));
      var language = vmName.substring(vmName.indexOf(".") + 1, vmName.length);
      const result = hljs.highlight(language, code || "", true);
      return result.value || '&nbsp;';
    },
    /** 预览按钮 */
    handlePreview() {
      previewTableSql(this.info).then(response => {
        this.preview.data = response.data;
        this.preview.open = true;
        this.preview.activeName = "domain.java";
      });
    },
    /** 生成代码操作 */
    handleGenTable() {
      if(this.info.genType === "1") {
        genCodeSql(this.info).then(response => {
          console.log(response)
          this.$modal.msgSuccess("成功生成到自定义路径：" + this.info.genPath);
        });
      } else {
        this.$download.zippost("/tool/gen/sql/batchGenCode","jiekou",this.info);
      }
    },
    /** 运行sql */
    yunxinSql() {
      yunxinSql(this.info).then(res => {
        this.$modal.msgSuccess(res.msg);
        if (res.code === 200) {
          this.close();
        }
      });
    }
  }
};
</script>
